<template>
	<view class="menu">
		<!-- 头部 -->
		<view class="menu_hd">
			<view class="hd_list">
				<uni-icons type="left" size="30" @tap="getPrev"></uni-icons>
				<view class="list_title">
					菜谱分类
				</view>
				<navigator>
					<uni-icons type="search" size="30"></uni-icons>
				</navigator>
			</view>
		</view>
		<!-- 组件  -->
		<indexMenu :munuList="munuList"></indexMenu>
	</view>
</template>

<script>
	import indexMenu from '../../../components/indexMenu/indexMenu.vue'
	export default {
		data() {
			return {
				munuList: null,
			};
		},
		components: {
			indexMenu
		},
		created() {
			this.getData()
		},
		methods: {
			getPrev() {
				this.$router.go(-1)
			},
			getData() {
				this.$axios('recipe/flatcatalogs').then(res => {
					console.log('菜谱--->', res.result)
					this.munuList = res.result
				})
			},
		}
	}
</script>

<style lang="scss">
	.menu {

		// tbu
		.menu_hd {
			width: 100%;
			border-bottom: 1rpx solid rgba(0, 0, 0, .2);
			position: fixed;
			background-color: #FFFFFF;
			z-index: 99;

			.hd_list {
				width: 96%;
				margin: 0 auto;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 20rpx 0;

				.list_title {
					width: 78%;
					font-size: 42rpx;
					// font-weight: bold;
				}
			}

		}
	}
</style>
